<div ng-controller="homeCtrl">
    <header></header>
    <div class="main">
        <!--搜索-->
        <div class="home-top clearfix">
            <p class="logo fl">
                <em>轻松购</em>
            </p>
            <div class="search fl">
                <div class="search-input">
                    <i></i>
                    <input type="text" placeholder="请输入商品名称">
                </div>
            </div>
            <p class="city fr">
                <b>上海</b>
            </p>
        </div>
        <!--轮播-->
        <div class="carousel swiper-container">
            <div class="swiper-wrapper">
                <div class="swiper-slide">
                    <a href="javascript:void(0)"><img src="./images/lunbo-img-01.jpg"></a>
                </div>
                <div class="swiper-slide">
                    <a href="javascript:void(0)"><img src="./images/lunbo-img-02.jpg"></a>
                </div>
                <div class="swiper-slide">
                    <a href="javascript:void(0)"><img src="./images/lunbo-img-03.jpg"></a>
                </div>
                <div class="swiper-slide">
                    <a href="javascript:void(0)"><img src="./images/lunbo-img-04.jpg"></a>
                </div>
                <div class="swiper-slide">
                    <a href="javascript:void(0)"><img src="./images/lunbo-img-05.jpg"></a>
                </div>
                <div class="swiper-slide">
                    <a href="javascript:void(0)"><img src="./images/lunbo-img-06.jpg"></a>
                </div>
            </div>
            <div class="swiper-pagination"></div>
        </div>
        <!--导航-->
        <div class="nav swiper-container">
            <div class="swiper-wrapper">
                <div class="swiper-slide">
                    <div class="nav-row">
                        <div class="nav-col">
                            <a class="nav-icon">
                                <img src="./images/nav-img-01.png">
                                <br>
                                <span>环球购</span>
                            </a>
                        </div>
                        <div class="nav-col">
                            <a class="nav-icon">
                                <img src="./images/nav-img-02.png">
                                <br>
                                <span>商城</span>
                            </a>
                        </div>
                        <div class="nav-col">
                            <a class="nav-icon">
                                <img src="./images/nav-img-03.png">
                                <br>
                                <span>生鲜</span>
                            </a>
                        </div>
                        <div class="nav-col">
                            <a class="nav-icon">
                                <img src="./images/nav-img-04.png">
                                <br>
                                <span>母婴</span>
                            </a>
                        </div>
                    </div>
                    <div class="nav-row">
                        <div class="nav-col">
                            <a class="nav-icon">
                                <img src="./images/nav-img-05.png">
                                <br>
                                <span>积分商城</span>
                            </a>
                        </div>
                        <div class="nav-col">
                            <a class="nav-icon">
                                <img src="./images/nav-img-06.png">
                                <br>
                                <span>卡券充值</span>
                            </a>
                        </div>
                        <div class="nav-col">
                            <a class="nav-icon">
                                <img src="./images/nav-img-07.png">
                                <br>
                                <span>签到送积分</span>
                            </a>
                        </div>
                        <div class="nav-col">
                            <a class="nav-icon">
                                <img src="./images/nav-img-08.png">
                                <br>
                                <span>曾经购买</span>
                            </a>
                        </div>
                    </div>
                </div>
                <div class="swiper-slide">
                    <div class="nav-row">
                        <div class="nav-col">
                            <a class="nav-icon">
                                <img src="./images/nav-img-09.png">
                                <br>
                                <span>进口</span>
                            </a>
                        </div>
                        <div class="nav-col">
                            <a class="nav-icon">
                                <img src="./images/nav-img-10.png">
                                <br>
                                <span>服装城</span>
                            </a>
                        </div>
                        <div class="nav-col">
                            <a class="nav-icon">
                                <img src="./images/nav-img-11.png">
                                <br>
                                <span>秒杀</span>
                            </a>
                        </div>
                        <div class="nav-col">
                            <a class="nav-icon">
                                <img src="./images/nav-img-12.png">
                                <br>
                                <span>商品分类</span>
                            </a>
                        </div>
                    </div>
                    <div class="nav-row">
                        <div class="nav-col">
                            <a class="nav-icon">
                                <img src="./images/nav-img-13.png">
                                <br>
                                <span>查订单</span>
                            </a>
                        </div>
                        <div class="nav-col">
                            <a class="nav-icon">
                                <img src="./images/nav-img-14.png">
                                <br>
                                <span>购物车</span>
                            </a>
                        </div>
                        <div class="nav-col">
                            <a class="nav-icon">
                                <img src="./images/nav-img-15.png">
                                <br>
                                <span>我的收藏</span>
                            </a>
                        </div>
                        <div class="nav-col">
                            <a class="nav-icon">
                                <img src="./images/nav-img-16.png">
                                <br>
                                <span>个人设置</span>
                            </a>
                        </div>
                    </div>
                </div>
            </div>
            <div class="swiper-pagination"></div>
        </div>
        <!--广播-->
        <div class="broadcast clearfix">
            <div class="broadcast-icon fl">快报</div>
            <div class="broadcast-cont fr">
                <p><b>消息：</b>真皮男鞋99元抢！</p>
            </div>
        </div>
        <!--秒杀-->
        <section class="box msBox">
            <div class="ms-title">
                <h3>轻松秒杀</h3>
                <div class="ms-title-time">
                    <span>还剩</span><i></i>
                    <span>0</span><span>3</span> : <span>5</span><span>1</span> : <span>2</span><span>4</span>
                </div>
                <p><a href="javascript:void(0)">限时限量&gt;</a></p>
            </div>
            <div class="ms-cont">
                <ul class="ms-cont-list">
                    <li class="ms-cont-item">
                        <a href="javascript:void(0)">
                            <img src="./images/miaosha-01.jpg">
                            <p>¥108.00</p>
                        </a>
                    </li>
                    <li class="ms-cont-item">
                        <a href="javascript:void(0)">
                            <img src="./images/miaosha-02.jpg">
                            <p>¥108.00</p>
                        </a>
                    </li>
                    <li class="ms-cont-item">
                        <a href="javascript:void(0)">
                            <img src="./images/miaosha-03.jpg">
                            <p>¥108.00</p>
                        </a>
                    </li>
                    <li class="ms-cont-item">
                        <a href="javascript:void(0)">
                            <img src="./images/miaosha-04.jpg">
                            <p>¥108.00</p>
                        </a>
                    </li>
                </ul>
            </div>
        </section>
        <!--特色频道-->
        <section class="box tsBox">
            <div class="b-title">
                <h2>特色频道</h2>
            </div>
            <div class="ts-cont">
                <div class="ts-row ts-row-first">
                    <div class="ts-row-item">
                        <div class="ts-item-first">
                            <a href="javascript:void(0)"><img src="./images/tese-01.jpg"></a>
                        </div>
                        <div>
                            <a href="javascript:void(0)" style="border-bottom: 1px solid #eee"><img src="./images/tese-02.jpg"></a>
                            <a href="javascript:void(0)"><img src="./images/tese-03.jpg"></a>
                        </div>
                    </div>
                </div>
                <div class="ts-row">
                    <div class="ts-row-item">
                        <div class="ts-item-first">
                            <a href="javascript:void(0)"><img src="./images/tese-04.jpg"></a>
                        </div>
                        <div>
                            <a href="javascript:void(0)"><img src="./images/tese-05.jpg"></a>
                        </div>
                    </div>
                </div>
            </div>
        </section>
        <!--广告1-->
        <section class="ad1">
            <div class="swiper-container">
                <div class="swiper-wrapper">
                    <div class="swiper-slide">
                        <a href="javascript:void(0)"><img src="./images/ad1-01.jpg"></a>
                    </div>
                    <div class="swiper-slide">
                        <a href="javascript:void(0)"><img src="./images/ad1-02.jpg"></a>
                    </div>
                </div>
                <div class="swiper-pagination"></div>
            </div>
        </section>
        <!--主题馆-->
        <section class="box ztBox">
            <div class="b-title">
                <h2>主题馆</h2>
            </div>
            <div>
                <a href="javascript:void(0)"><img src="./images/zhuti-01.jpg"></a>
            </div>
            <div class="zt-cont">
                <div class="zt-row-first">
                    <a href="javascript:void(0)">
                        <div class="zt-first-item" style="border-right: 1px solid #eee;">
                            <div>
                                <h3><b>生鲜</b></h3>
                                <p>奇异果销售</p>
                            </div>
                            <div>
                                <img src="./images/zt-01.jpg">
                            </div>
                        </div>
                    </a>
                    <a href="javascript:void(0)">
                        <div class="zt-first-item">
                            <div>
                                <h3><b>食品饮料</b></h3>
                                <p>美味1元起</p>
                            </div>
                            <div>
                                <img src="./images/zt-02.jpg">
                            </div>
                        </div>
                    </a>
                </div>
                <div class="zt-row-list">
                    <div class="zt-row">
                        <div class="zt-row-item">
                            <a href="javascript:void(0)">
                                <div>
                                    <h3><b>家清日百</b></h3>
                                    <p>满99减30</p>
                                </div>
                                <div>
                                    <img src="./images/zt-03.jpg">
                                </div>
                            </a>
                            <a href="javascript:void(0)">
                                <div>
                                    <h3><b>母婴用品</b></h3>
                                    <p>全场3折起</p>
                                </div>
                                <div>
                                    <img src="./images/zt-04.jpg">
                                </div>
                            </a>
                            <a href="javascript:void(0)">
                                <div>
                                    <h3><b>电器城</b></h3>
                                    <p>大牌一降到底</p>
                                </div>
                                <div>
                                    <img src="./images/zt-05.jpg">
                                </div>
                            </a>
                        </div>
                    </div>
                    <div class="zt-row">
                        <div class="zt-row-item">
                            <a href="javascript:void(0)">
                                <div>
                                    <h3><b>个护美妆</b></h3>
                                    <p>美护1元秒</p>
                                </div>
                                <div>
                                    <img src="./images/zt-06.jpg">
                                </div>
                            </a>
                            <a href="javascript:void(0)">
                                <div>
                                    <h3><b>服饰内衣</b></h3>
                                    <p>大牌联促</p>
                                </div>
                                <div>
                                    <img src="./images/zt-07.jpg">
                                </div>
                            </a>
                            <a href="javascript:void(0)">
                                <div>
                                    <h3><b>家纺家装</b></h3>
                                    <p>满99减20</p>
                                </div>
                                <div>
                                    <img src="./images/zt-08.jpg">
                                </div>
                            </a>
                        </div>
                    </div>
                    <div class="zt-row">
                        <div class="zt-row-item">
                            <a href="javascript:void(0)">
                                <div>
                                    <h3><b>户外运动</b></h3>
                                    <p>低至39元起</p>
                                </div>
                                <div>
                                    <img src="./images/zt-09.jpg">
                                </div>
                            </a>
                            <a href="javascript:void(0)">
                                <div>
                                    <h3><b>鞋靴箱包</b></h3>
                                    <p>万向轮119元</p>
                                </div>
                                <div>
                                    <img src="./images/zt-10.jpg">
                                </div>
                            </a>
                            <a href="javascript:void(0)">
                                <div>
                                    <h3><b>图书文具</b></h3>
                                    <p>阅享开门红</p>
                                </div>
                                <div>
                                    <img src="./images/zt-11.jpg">
                                </div>
                            </a>
                        </div>
                    </div>
                </div>
            </div>
        </section>
        <!--广告2-->
        <section class="ad2">
            <div class="swiper-container">
                <div class="swiper-wrapper">
                    <div class="swiper-slide">
                        <a href="javascript:void(0)"><img src="./images/ad2-01.jpg"></a>
                    </div>
                    <div class="swiper-slide">
                        <a href="javascript:void(0)"><img src="./images/ad2-02.jpg"></a>
                    </div>
                </div>
                <div class="swiper-pagination"></div>
            </div>
        </section>
        <!--品牌推荐-->
        <section class="box ppBox">
            <div class="b-title">
                <h2>品牌推荐</h2>
            </div>
            <div class="pp-cont">
                <a href="javascript:void(0)">
                    <img src="./images/pp-01.jpg">
                </a>
                <a href="javascript:void(0)">
                    <img src="./images/pp-02.jpg">
                </a>
                <a href="javascript:void(0)">
                    <img src="./images/pp-03.jpg">
                </a>
            </div>
        </section>
        <!--店铺推荐-->
        <section class="box dpBox">
            <div>
                <a href="javascript:void(0)"><img src="./images/dp-01.jpg"></a>
            </div>
            <div class="b-title clearfix">
                <h2 class="fl">店铺推荐</h2>
                <h2 class="fr"><a href="javascript:void(0)">查看更多店铺&gt;</a></h2>
            </div>

            <div class="swiper-container">
                <div class="swiper-wrapper">
                    <div class="swiper-slide">
                        <div class="dp-item">
                            <div class="clearfix">
                                <div class="dp-logo fl"><img src="./images/dp-02.jpg"></div>
                                <div class="fl">
                                    <h3><b>果郡王旗舰店</b></h3>
                                    <p><span>HOT</span>&nbsp;全场一分钱起</p>
                                </div>
                            </div>
                            <div class="db-goods">
                                <div>
                                    <a href="javascript:void(0)"><img src="./images/dp-03.jpg"></a>
                                </div>
                                <div>
                                    <a href="javascript:void(0)"><img src="./images/dp-04.jpg"></a>
                                </div>
                                <div>
                                    <a href="javascript:void(0)"><img src="./images/dp-05.jpg"></a>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="swiper-slide"></div>
                    <div class="swiper-slide"></div>
                    <div class="swiper-slide"></div>
                    <div class="swiper-slide"></div>
                </div>
                <div class="swiper-pagination"></div>
            </div>
        </section>
        <!--专享推荐-->
        <div class="zx">
            <div class="zx-title">
                <h2>专享推荐</h2>
            </div>
            <ul class="zx-list clearfix">
                <li>
                    <div>
                        <a href="javascript:void(0)">
                            <img src="./images/zx-01.jpg">
                        </a>
                    </div>
                    <div class="zx-price">
                        <p>景田百岁山矿泉水570ml/瓶</p>
                        <p><span><b>¥2.60</b></span><del>¥3.00</del></p>
                    </div>
                </li>
                <li>
                    <div>
                        <a href="javascript:void(0)">
                            <img src="./images/zx-02.jpg">
                        </a>
                    </div>
                    <div class="zx-price">
                        <p>陶华碧老干妈香辣脆油辣椒210g/瓶</p>
                        <p><span><b>¥8.50</b></span><del>¥9.80</del></p>
                    </div>
                </li>
                <li>
                    <div>
                        <a href="javascript:void(0)">
                            <img src="./images/zx-03.jpg">
                        </a>
                    </div>
                    <div class="zx-price">
                        <p>GP超霸7号七号AAA高能超强电池2粒装</p>
                        <p><span><b>¥1.50</b></span><del>¥3.40</del></p>
                    </div>
                </li>
                <li>
                    <div>
                        <a href="javascript:void(0)">
                            <img src="./images/zx-04.jpg">
                        </a>
                    </div>
                    <div class="zx-price">
                        <p>雀巢咖啡1+2特浓7条*13g/盒</p>
                        <p><span><b>¥9.90</b></span><del>¥10.50</del></p>
                    </div>
                </li>
                <li>
                    <div>
                        <a href="javascript:void(0)">
                            <img src="./images/zx-05.jpg">
                        </a>
                    </div>
                    <div class="zx-price">
                        <p>雀巢咖啡丝滑拿铁 20g*5条/盒</p>
                        <p><span><b>¥14.70</b></span><del>¥25.00</del></p>
                    </div>
                </li>
                <li>
                    <div>
                        <a href="javascript:void(0)">
                            <img src="./images/zx-06.jpg">
                        </a>
                    </div>
                    <div class="zx-price">
                        <p>纳爱斯伢牙乐儿童牙膏(亲亲草莓)40克/支</p>
                        <p><span><b>¥5.90</b></span><del>¥7.50</del></p>
                    </div>
                </li>
                <li>
                    <div>
                        <a href="javascript:void(0)">
                            <img src="./images/zx-07.jpg">
                        </a>
                    </div>
                    <div class="zx-price">
                        <p>可比克 薯片 番茄味 60g/袋</p>
                        <p><span><b>¥3.90</b></span><del>¥4.70</del></p>
                    </div>
                </li>
                <li>
                    <div>
                        <a href="javascript:void(0)">
                            <img src="./images/zx-08.jpg">
                        </a>
                    </div>
                    <div class="zx-price">
                        <p>景田百岁山矿泉水 570ml/瓶</p>
                        <p><span><b>¥2.60</b></span><del>¥3.00</del></p>
                    </div>
                </li>
                <li>
                    <div>
                        <a href="javascript:void(0)">
                            <img src="./images/zx-09.jpg">
                        </a>
                    </div>
                    <div class="zx-price">
                        <p>景田百岁山矿泉水 570ml/瓶</p>
                        <p><span><b>¥2.60</b></span><del>¥3.00</del></p>
                    </div>
                </li>
                <li>
                    <div>
                        <a href="javascript:void(0)">
                            <img src="./images/zx-10.jpg">
                        </a>
                    </div>
                    <div class="zx-price">
                        <p>景田百岁山矿泉水 570ml/瓶</p>
                        <p><span><b>¥2.60</b></span><del>¥3.00</del></p>
                    </div>
                </li>
            </ul>
        </div>
    </div>
    <footer class="clearfix">
        <a ui-sref="home" class="fl">
            <i class="ai1"></i>
            <span>首页</span>
        </a>
        <a ui-sref="type" class="fl">
            <i class="ai ai2"></i>
            <span>商品分类</span>
        </a>
        <a ui-sref="cart" class="fl">
            <i class="ai3"></i>
            <span>购物车</span>
        </a>
        <a ui-sref="user" class="fl">
            <i class="ai4"></i>
            <span>我的账户</span>
        </a>
    </footer>
</div>